<!DOCTYPE html>
<html lang="UTF-8" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="keys" content="">
    <meta name="author" content="">
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="/css/font-awesome.min.css">
    <link rel="stylesheet" href="/css/login.css">
    <style>

    </style>
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="container">
        <div class="navbar-header">
            <div><a class="navbar-brand" href="index.html" style="font-size:32px;">尚筹网-创意产品众筹平台</a></div>
        </div>
    </div>
</nav>

<div class="container">

    <form class="form-signin" method="post" role="form" th:action="@{/member/manager/register}">
        <h2 class="form-signin-heading"><i class="glyphicon glyphicon-log-in"></i> 用户注册</h2>
        <div class="form-group has-success has-feedback">
            <input name="loginacct" type="text" class="form-control" id="loginacct" placeholder="请输入登录账号" autofocus>
            <span class="glyphicon glyphicon-user form-control-feedback"></span>
        </div>
        <div class="form-group has-success has-feedback">
            <input name="userpswd" type="text" class="form-control" id="userpswd" placeholder="请输入登录密码" style="margin-top:10px;">
            <span class="glyphicon glyphicon-lock form-control-feedback"></span>
        </div>
        <div class="form-group has-success has-feedback">
            <input name="phoneNum" type="text" class="form-control" id="phoneNum" placeholder="请输入手机号" style="margin-top:10px;">
            <span class="glyphicon glyphicon glyphicon-envelope form-control-feedback"></span>
        </div>
        <div class="form-group has-success has-feedback">
            <input name="randomCode" type="text" class="form-control" id="randomCode" placeholder="请输入验证码" style="margin-top:10px;">
            <span class="glyphicon glyphicon-copyright-mark form-control-feedback"></span>
        </div>
        <div class="form-group has-success has-feedback">
            <button id="randomCodeBtn" class="btn btn-success">发送验证码</button>
        </div>

        <input type="submit" class="btn btn-lg btn-success btn-block" value="注册">
    </form>
</div>
<script src="/jquery/jquery-2.1.1.min.js"></script>
<script src="/bootstrap/js/bootstrap.min.js"></script>
<script>
    var sec=60;
    var isStop=0;
    $(function () {
        $('#randomCodeBtn').click(function () {
            //验证手机号
            var phoneNum=$('#phoneNum').val();
            if(phoneNum.length==0){
                alert('手机号不能为空');
                return;
            }
            //禁用按钮
            $('#randomCodeBtn').attr("disabled",true);
            //启动定时器
            isStop=setInterval("time()",1000);
            $.getJSON("/member/manager/send/code",{phoneNum:phoneNum},function (resultEntity) {
                if(resultEntity!=null){
                    alert('验证码发送成功')
                }
            });
            
        });
    });
    function time() {
        if (sec>0){
            sec--;
            $('#randomCodeBtn').text(sec+'s后，重新发送');
        }else {
            sec=60;
            $('#randomCodeBtn').attr("disabled",false);
            $('#randomCodeBtn').text('重新发送');
            clearInterval(isStop);
        }
    }
</script>
</body>
</html>